//学科评估
<template>
  <div class="module_">
    <div class="mb8">
      <search @clearSearch='clearSearch' :self="true">
        <el-form label-width='50px' inline autocomplete="off" :model="pageparm" class="search_box">
          <el-form-item label="学科">
            <inputSearch ref="search_d" type="xueke" @onChange='searchChane($event,"discipline_id")' />
          </el-form-item>
          <el-form-item label="年度">
            <el-date-picker :clearable="false" @change="searchYear" v-model="year" format="yyyy年" value-format="yyyy" type="year"
              placeholder="请选择评估年度">
            </el-date-picker>
          </el-form-item>
        </el-form>
        <subjectExport v-if="!noBumber && !loading" slot="footer" :options="ops" :apiFn='Apievaluatetaskdetail' :name='ops.year + "_学科评估"' />
      </search>
    </div>

    <myTable v-if="tableHeader.length > 0" :col="tableHeader" :tableData="tableData" :tableLoading="tableLoading"
      :operation="false" :childMsg='pageparm' @callFather="callFather">
      <el-table-column slot="one" align="center" show-overflow-tooltip prop="total_score" label="总分" width="100">
      </el-table-column>
    </myTable>
    <div v-if="tableHeader.length == 0 && loading" class="flex-1" v-loading="true">

    </div>
    <el-empty v-if="noBumber && !loading" :image-size="200" description="暂无数据"></el-empty>
  </div>
</template>

<script>
  import {
    Apievaluatetaskdetail,
    ApievaluatetemplateInfo,
  } from '@/api'
  import {
    debounce,
    adminShow,
    throttle
  } from "@/utils/index";
  import myTable from "../components/myTable.vue"
  import subjectExport from "../components/subjectExport.vue"
  export default {
    name: 'subject_viewScore',
    components: {
      myTable,
      subjectExport
    },
    data() {
      return {
        Apievaluatetaskdetail,
        tableData: [],
        tableHeader: [],
        year: null,
        noBumber: false,
        pageparm: {
          page: 1,
          perPage: 20,
          total: null,
          sort_str: null,
          sort_order: 'desc',
        },
        tableLoading: false,
        headerList:[],
        ops: {
          year: null,
        },
        loading:false,
      }
    },
    mounted() {
      this.getTableHeader()
    },
    methods: {
      getTableHeader() {
        this.loading = true
        this.tableHeader = []
        this.tableData = []
        ApievaluatetemplateInfo(null, {
          year: this.year
        }).then(res => {
          this.loading = false
          if (!res.data) {
            this.noBumber = true
          } else {
            this.noBumber = false
            this.tableHeader = res.data.template
            this.ops.year = res.data.year
            this.year = new Date(res.data.year, 1, 1)
            this.getList()
            
            //获取导出表头
            const newArr = [{
              prop:'department.name',
              label:'科室'
            },{
              prop:'year',
              label:'年度'
            }]
            const threeIndex = (arr) => {
              arr.forEach(item => {
                if (item.children.length > 0) {
                  threeIndex(item.children)
                } else {
                  newArr.push(item)
                }
              })
            }
            threeIndex(res.data.template)
            this.headerList = newArr.concat([{prop:'total_score',label:'总分'}])
          }
        })
      },
      //搜索
      clearSearch() {
        this.year = null
        this.$refs.search_d.clear()
        this.getTableHeader()
      },
      searchChane(i, val) {
        this.pageparm[val] = i
        this.pageparm.page = 1
        this.tableLoading = true
        this.getList()
      },
      searchYear() {
        this.getTableHeader()
      },
      //分页
      callFather(pageparm) {
        this.pageparm.page = pageparm.page
        this.pageparm.perPage = pageparm.perPage
        this.tableLoading = true
        this.getList()
      },
      getList() {
        this.pageparm = {
          ...this.pageparm,
          ...this.ops
        }
        Apievaluatetaskdetail(this.pageparm).then(({
          data,
          page
        }) => {
          this.tableData = data || []
          this.pageparm.total = page.total
          this.tableLoading = false
        }).catch(() => {
          this.tableLoading = false
        })
      },
    },

  }
</script>
<style lang='less' scoped>
  .header_cell {
    position: relative;
    height: 50px;
  }

  .header_cell--block {
    position: absolute;
  }

  .header_cell--left {
    left: 0;
    bottom: 0;
  }

  .header_cell--right {
    right: 0;
    top: 0;
  }

  .header_cell--line {
    width: 168px;
    height: 1px;
    background: #DCDFE6;
    top: 0;
    left: 0;
    transform: rotate(17deg);
    transform-origin: left top;
  }

  a:hover {
    color: #1ECA66;
  }
</style>